<template>
  <div class='morning'>
    <canvas id="morning" width="375" height="300"></canvas>
    <p class="hidden">{{getData}}</p>
  </div>
</template>
<script>
import {drawSleep,drawMorning,drawWords} from './morning.js'
export default {
  props:["inputVal"],
  components: {},
  name: "",
  data() {
    return {};
  },
  computed:{
    getData(){
      var showText=false;
      for(var item of this.$store.state.login.special){
        if(item==this.inputVal){
          showText=true;
          break;
        }
      }
      this.$nextTick(()=>{
        drawWords(showText?this.inputVal:this.$store.state.login.morning.default)
      })
      return this.inputVal
    }
  },
  methods: {},
};
</script>
<style lang="scss" scoped>
.morning {

}
</style>